<template>
  <div>
    <div v-for="(bodyPart, index) in snake" :key="index" :style="getSnakeStyles(bodyPart)"></div>
  </div>
</template>

<script>
export default {
  props: {
    snake: {
      type: Array,
      default: () => [{ x: 0, y: 0 }],
    },
  },
  methods: {
    getSnakeStyles(bodyPart) {
      return {
        position: 'absolute',
        width: '20px',
        height: '20px',
        background: 'green',
        left: `${bodyPart.x}px`,
        top: `${bodyPart.y}px`,
      }
    },
  },
}
</script>

<style></style>